<!DOCTYPE html>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="js/jquery.js"></script>
<title>Web SQL Database Test</title>

</head>

<body onload="">
<script>

	// create database
	var db = window.openDatabase('Calendar', '0.1', 'AceCalendar', 200000);
	// create table & insert
	db.transaction(function (tx) {
  		tx.executeSql('CREATE TABLE IF NOT EXISTS EVENTS (id integer, Date, Title, log, PRIMARY KEY (id))');
		for(i=0; i<5; i++)
		{
			tx.executeSql("INSERT INTO EVENTS (log) VALUES (" + i +")");
		}
		msg = '<p>Log message created and row inserted.</p>';
	    $("body").append(msg);
	});
	db.transaction(function (tx) {
  		tx.executeSql('SELECT * FROM EVENTS', [], function (tx, results) {
  		var len = results.rows.length, i;
   		msg = "<p>Found rows: " + len + "</p>";
		$("body").append(msg);
   			for (i = 0; i < len; i++){
     			msg = "<p><b>" + results.rows.item(i).log + "</b></p>";
     	$("body").append(msg);
   }
 }, null);
});


	
</script>
</body>
</html>